<template>
	<view>
		<view class="group_1">
			<view class="nav-bar_1 flex-row" style="justify-content: space-between;align-items: center;">
				<div class="flex-row" style="align-items: center;">
					<image src="@/static/images/xiangzuo.png" alt=""
						style="width: 17upx;height: 30upx;margin-right:20upx" @tap="goBack"></image>
					<text class="text_1">工程招标</text>
				</div>
				<text class="text_2" @tap="publish()">发布</text>
			</view>
			<view class="input_1 flex-row" style="align-items: center;">
				<image class="icon_1" referrerpolicy="no-referrer" src="@/static/images/sousuo1.png" />
				<input class="text_3" type="text" placeholder="请输入工程名称等关键字" v-model="keyword" />
				<view class="search-btn" @tap="getSearchRes">搜索</view>
			</view>

		</view>
		<div class="box_1 flex-col" style="width: 100%;"></div>
		<FilterDropdown :menuTop="menuTop" :filterData="filterData" :defaultSelected="defaultSelected"
			:updateMenuName="true" dataFormat="Object"></FilterDropdown>

		<view class="group_4">

			<view class="list_1" style="width: 96%;margin-left: 2%;">
				<view class="list-items_1 flex-row" style="width: 100%;" v-for="(item, index) in lists" :key="index"
					@tap="goDetail(item.id)">
					<view class="box_5 flex-col">
						<image :src="item.pic" mode="scaleToFill" style="width: 102upx;height: 102upx"></image>
					</view>
					<view class="text-group_4 flex-col">
						<text class="text_4">{{item.title}}</text>
						<text class="text_5" v-if="item.amount > 0">工程量：{{item.amount}}m³</text>
						<text class="text_5" v-else>工程量：待定</text>
						<text class="text_6">地址：{{item.address}}</text>
					</view>
					<view class="box_6 flex-col justify-center">
						<view class="text-wrapper_1 flex-row justify-between" v-if="item.price > 0">
							<text class="text_7">{{item.price}}</text>
							<text class="text_8">万</text>
						</view>
						<view class="text-wrapper_1 flex-row justify-between" v-else>
							<text class="text_7">待定</text>
						</view>
						<view class="text_9">报价</view>
					</view>
				</view>

				<uni-load-more :status="loadingType"></uni-load-more>
			</view>
		</view>
	</view>
</template>
<script>
	import FilterDropdown from '@/components/HM-filterDropdown/HM-filterDropdown.vue';
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
	export default {
		data() {
			return {
				keyword: '',
				dataObj: {
					page: 1,
				},

				menuTop: 233,
				filterData: [],
				defaultSelected: [],
				lists: [],
				valueArr: [],

				loadingType: 'more',
				constants: {}
			};
		},
		components: {
			FilterDropdown,
			uniLoadMore
		},

		// 页面生命周期，下拉刷新后触发
		onPullDownRefresh() {
			this.lists = [];
			this.dataObj = {
				page: 1,
				keyword: this.keyword
			};

			this.loadingType = 'more';

			this.getLists('refresh')

			// 停止下拉刷新
			setTimeout(function() {
				uni.stopPullDownRefresh()
			}, 500)
		},

		onLoad: function() {
			uni.showLoading({
				title: '加载中...'
			});

			this.getAllSearch();
			this.loadData();

			// #ifdef APP-PLUS
			this.menuTop = 328
			// #endif
			// #ifdef MP-WEIXIN
			this.menuTop = 328
			// #endif

			setTimeout(() => {
				this.isLoaded = true;
				uni.hideLoading();
			}, 600)

		},
		methods: {
			async loadData(keyword = '') {
				this.keyword = '';
				if (keyword) {
					this.keyword = keyword;
					this.dataObj.keyword = keyword;
					this.valueArr.push({
						'keyword': keyword
					});
				}

				this.getLists();
			},
			//获取搜索条件
			async getAllSearch() {
				let sdata = await this.$myRequest({
					url: '/common/allhSearch'
				})

				let data = sdata.data.data;
				this.filterData = data;
			},

			getSearchRes() {
				if (this.keyword == '') {
					this.$api.msg('请输入关键字！');
					return false;
				}
				this.lists = [];
				this.dataObj = {
					page: 1,
					keyword: this.keyword
				};
				this.loadingType = 'more';

				this.getLists('refresh')
			},

			async getLists(type = 'add') {
				//这里是将订单挂载到tab列表下
				if ((this.loadingType === 'loading' || this.loadingType === 'noMore') && type == 'add') {
					//防止重复加载
					return;
				}

				this.loadingType = 'loading';

				let url = '/projects';
				let ldata = await this.$myRequest({
					url: url,
					data: this.dataObj
				})

				let ndata = ldata.data.data.list;

				if (ndata.length > 0) {
					this.lists = [...this.lists, ...ndata];
					let count = ldata.data.data.totalCount;

					if (this.lists.length < count) {
						this.dataObj.page = this.dataObj.page + 1;
						this.loadingType = 'more';
					} else {
						this.loadingType = 'noMore';
					}
				} else {
					this.loadingType = 'noMore';
				}
			},

			goBack() {
				uni.navigateBack({
					delta: 1
				});
			},

			publish() {
				uni.navigateTo({
					url: '/pages1/pages/projects-commen/projects/publish/publish'
				})
			},

			goDetail(id) {
				uni.navigateTo({
					url: '/pages1/pages/projects-commen/projects/detail/index?id=' + id
				});
			}
		}
	};
</script>
<style lang='css'>
	@import '@/pages1/pages/projects-commen/common/common.css';
	@import './assets/style/index.rpx.css';

	page {
		background-color: #f7f7f7;
	}
</style>
<style lang="scss" scoped>
	.group_1 {
		// #ifdef APP-PLUS
		padding-top: 100upx;
		height: 422upx;
		// #endif
		// #ifdef MP-WEIXIN
		padding-top: 120upx;
		height: 425upx;
		// #endif
	}

	.search-btn {
		font-size: 30rpx;
		background-color: #f3511a;
		color: white;
		width: 110rpx;
		letter-spacing: 2rpx;
		height: 57rpx;
		line-height: 57rpx;
		text-align: center;
		border-radius: 50rpx;
	}
</style>
